'use client';

import { useVip } from '@/app/hooks/use-vip';
import ClientVipTip from './client-vip-tip';

interface VipContentProps {
  isVip: boolean;
  children: React.ReactNode;
}

/**
 * 根据内容VIP属性和用户VIP状态决定是否显示内容的组件
 */
export default function VipContent({ isVip, children }: VipContentProps) {
  const { isVipUser, isLoaded } = useVip();
  
  // 如果VIP状态还未加载完成，显示加载中
  if (!isLoaded) {
    return (
      <div className="flex justify-center items-center py-8">
        <div className="animate-spin rounded-full h-8 w-8 border-t-2 border-b-2 border-red-600"></div>
      </div>
    );
  }
  
  // 检查是否有权限访问
  if (isVip && !isVipUser) {
    return (
      <ClientVipTip message="此内容仅限VIP用户观看，请升级VIP后继续" />
    );
  }
  
  // 有权限访问，显示内容
  return <>{children}</>;
} 